<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="my" uri="/mytags" %>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>部门比对数据</title>
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/asserts/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
	
		<!-- js插件 -->
		<script src="${pageContext.request.contextPath}/js/jquery-3.2.1.min.js"></script>
		<script src="${pageContext.request.contextPath}/asserts/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
        <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/asserts/bootstrapValidate/css/bootstrapValidator.min.css"/>
 	   <script src="${pageContext.request.contextPath}/asserts/bootstrapValidate/js/bootstrapValidator.min.js"></script>
	 <style type="text/css">
			button{
 				height:30px;
 			}
 			.btn{
 				height:30px;
 				padding:2px;
 			}
 			.panel-body{
 				padding:2px;
 			}
		</style>
	</head>
	<body>
			<!-- 内容展示区 -->
			<div >
					<!-- 导航 -->
					<ol class="breadcrumb">
						<li><i class="fa fa-comment"></i>部门比对数据列表</li>
					</ol>
					<div class="container-fluid">
						<!-- 	内容面板 -->
						<div class="panel panel-default">
							<!-- 控制按钮 -->
							<div class="panel-heading">
									<div class="btn-group">
										<button class="btn btn-primary" data-toggle="modal" data-target="#mymodal" ><span class="glyphicon glyphicon-pencil"></span>添加</button>
												<button class="btn btn-success"  data-toggle="modal" data-target="#mymodalimport"><span class="glyphicon glyphicon-import"></span>导入excel</button>
								    	<button class="btn btn-info" onclick="downTemplate()"><span class="glyphicon glyphicon-export"></span>导出excel模板</button>
											<button class="btn btn-danger" onclick="removeAll()"><span class="glyphicon glyphicon-remove"></span>批量删除</button>
								</div>
							</div><!-- 控制按钮  end-->
							<div class="panel-body">
								<form action="${pageContext.request.contextPath}/departlist/list" method="post"  class="form-horizontal" >
								     <div class="form-group">
										<label class="control-label col-md-2">学生姓名：</label>
										<div class="col-md-3">
											<input type="text" name="name" value="${name}" placeholder="输入学生姓名" class="form-control"  />
										
										</div>
										<label class="control-label col-md-2">身份证号：</label>
										<div class="col-md-3">
											<input type="text" name="idcard" value="${idcard}" placeholder="输入身份证号码" class="form-control"  />
										
										</div>
										<div class="col-md-2">
												<button class="btn btn-success">查询</button>
										</div>
									</div>
									 <div class="form-group">
									 	 <label class="control-label col-md-2">所属乡镇：</label>
											<div class="col-md-3">
												 		  <select id="zid" name="zid" class="form-control" onchange="changeZhen(this)">
															<option value="">请选择</option>
															<c:forEach var="xz" items="${xzList}">
																<option value="${xz.id}" <c:if test="${xz.id==zid}">selected="selected"</c:if>>${xz.name}</option>
															</c:forEach>
														</select>
											</div>
										<label class="control-label col-md-2">所属学校(先选择乡镇)：</label>
										<div class="col-md-3">
											 <select id="schid" name="schid" class="form-control">
												<option value="">请选择</option>
												  <c:forEach var="school" items="${schoolListByZid}">
										 		   <option value="${school.schid}" <c:if test="${school.schid==schid}">selected="selected"</c:if>>${school.name}(${school.level})</option>
										 		
										 	      </c:forEach>
											</select> 
										</div>
										
									</div>
									 
									 
									<%-- 	<label class="control-label col-md-2">所在学校：</label>
										<div class="col-md-3">
											 <select name="schid" class="form-control">
											<option value="">请选择</option>
										 	<c:forEach var="school" items="${schoolList}">
										 		<option value="${school.schid}" <c:if test="${school.schid==schid}">selected="selected"</c:if>>${school.name}(${school.level})</option>
										 		
										 	</c:forEach>
										</select> 
										</div>
									 </div> --%>
								</form>
								<table id="listtable" class="table table-bordered table-striped table-condensed table-hover">
									<tr class="success">
										<th width="2%"><input type="checkbox" id="selectAll" onclick="checkAlls(this)" /></th>
										<th width="2%">序号</th>
										<th style="display:none" width="5%">ID</th>
										<th width="5%">姓名</th>
										<th width="10%">身份证号</th>
 										<th width="18%">学校名称</th>
										<th width="5%">学段</th>
										<th width="15%">比对反馈类型</th>
										<th width="8%">证件号码</th>
										<th width="10%">操作</th>
									</tr>
									<!-- 数据绑定 -->
									<c:forEach items="${pageInfo.list}" var="departlist" varStatus="vs">
										<tr>
											<td><input type="checkbox" name="checkId" value="${departlist.id}" /></td>
											<td width="4%" style="text-align:center" >${(pageInfo.pageNum-1)*20+vs.count}</td>
											<td style="display:none">${departlist.id}</td>
											<td>${departlist.name}</td>
											<td>${departlist.idcard}</td>
											<td>${departlist.school.name}</td>
											<td>${departlist.school.level}</td>
											<td>${departlist.comparetype}</td>
											<td>${departlist.cardtype}</td>
											<td>
												<button type="button" class="btn btn-primary" 
													data-toggle="modal" data-target="#updatemodal" onclick="update(this)" >
													 <span class="glyphicon glyphicon-edit"></span> 修改</button>
												 <button type="button" class="btn btn-danger" onclick="del(${departlist.id})"> 
												 	<span class="glyphicon glyphicon-remove"></span> 删除</button>
											</td>
										</tr>
									</c:forEach>
									<!-- 	数据绑定 end -->
								</table>
								<!-- 	分页 -->
								<my:page prePage="${pageInfo.prePage}" nextPage="${pageInfo.nextPage}"
				 url="${pageContext.request.contextPath}/departlist/list?n=1&x=1" totalPage="${pageInfo.pages }" currentPage="${pageInfo.pageNum}"/>
									<!-- <nav class="text-center">
									<ul class="pagination pagination-sm">
										<li class="disabled"><a href="javascript:void(0)">&laquo;</a></li>
										<li class="active"><a href="">1</a></li>
										<li><a href="">2</a></li>
										<li><a href="">3</a></li>
										<li><a href="">...</a></li>
										<li><a href="">49</a></li>
										<li><a href="">50</a></li>
										<li><a href="">&raquo;</a></li>
									</ul>
									</nav> -->
							</div>
						</div><!-- 内容面板 end -->
					</div>
			</div><!-- 	内容展示区 end-->
	 
		
		<!-- 弹层组件 添加标签 -->
		<div class="modal fade" id="mymodal">
			<div class="modal-dialog">
				<div class="modal-content">
					<form action="${pageContext.request.contextPath}/departlist/add"  class="form-horizontal">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
							<h4 class="modal-title" id="mylabel">部门比对数据信息</h4>
						</div>
						<div class="modal-body">
							  
							  <!-- 学校-->
								<div class="form-group">
									<label class="control-label col-md-3">姓名：</label>
									<div class="col-md-8">
										<input type="text" name="name" placeholder="请输入姓名" class="form-control"  />
									</div>
								</div>
								  <!-- 学校-->
								<div class="form-group">
									<label class="control-label col-md-3">身份证号：</label>
									<div class="col-md-8">
										<input type="text" name="idcard" placeholder="请输入身份证号" class="form-control"  />
									</div>
								</div>
								<div class="form-group">
									<label class="control-label col-md-3">学校名称：</label>
									<div class="col-md-8">
										<select name="schid" class="form-control">
											<option value="">请选择</option>
											<c:forEach items="${ schoolList }" var="school" >
	          									<option value="${ school.schid }">${ school.name }(${school.level})</option>
	          								</c:forEach>
										</select>
									</div>
								</div>
							  		<div class="form-group">
									<label class="control-label col-md-3">比对反馈类型：</label>
									<div class="col-md-8">
										<select name="comparetype" class="form-control">
											   <option value="">请选择</option>
									           <option value="建档立卡">建档立卡</option>
									           <option value="农村低保">农村低保</option>
									           <option value="城市低保">城市低保</option>
									           <option value="特困人员">特困人员</option>
									           <option value="孤儿">孤儿</option>
									           <option value="烈士子女">烈士子女</option>
									           <option value="残疾学生">残疾学生</option>
										</select> 
									</div>
								</div>
								<div class="form-group">
									<label class="control-label col-md-3">证件号码：</label>
									<div class="col-md-8">
										<input type="text" name="cardtype" placeholder="请输入证件号码" class="form-control"  />
									</div>
								<!-- </div>
									<div class="form-group">
									<label class="control-label col-md-3">所属学校id：</label>
									<div class="col-md-8">
										<input type="text" name="schid" placeholder="请输入所属学校id" class="form-control"  />
									</div>
								</div> -->
									
								<!-- <div class="form-group">
									<label class="control-label col-md-3">所属学校：</label>
									<div class="col-md-8">
									 <select name="schid" class="form-control">
											<option value="">请选择</option>
										 
										</select> 
									</div>
								</div> -->
							 
							</div>
						</div>
						<div class="modal-footer">
							<button class="btn btn-danger" type="button">关闭</button>
							<button class="btn btn-primary" type="submit">录入</button>
						</div>
					</form>
				</div>
			</div>
		</div>
		<!-- 弹层组件 添加标签 end -->
	 
	 <!-- 弹层组件 添加标签 -->
		<div class="modal fade" id="updatemodal">
			<div class="modal-dialog">
				<div class="modal-content">
					<form action="${pageContext.request.contextPath}/departlist/update"  class="form-horizontal">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
							<h4 class="modal-title" id="mylabel">部门比对数据信息</h4>
						</div>
						<div class="modal-body">
							  
							  <!-- 学校-->
							  <input type="hidden" name="id" class="form-control"  />
								<div class="form-group">
									<label class="control-label col-md-3">姓名：</label>
									<div class="col-md-8">
										<input type="text" name="name" placeholder="请输入姓名" class="form-control"  />
									</div>
								</div>
								  <!-- 学校-->
								<div class="form-group">
									<label class="control-label col-md-3">身份证号：</label>
									<div class="col-md-8">
										<input type="text" name="idcard" placeholder="请输入身份证号" class="form-control"  />
									</div>
								</div>
								<div class="form-group">
									<label class="control-label col-md-3">学校名称：</label>
									<div class="col-md-8">
										<select name="schid" class="form-control">
											<option value="">请选择</option>
											 <c:forEach items="${ schoolList }" var="school" >
	          									<option value="${ school.schid }">${ school.name }</option>
	          								</c:forEach>
										</select>
									</div>
								</div>
									 
							  		<div class="form-group">
									<label class="control-label col-md-3">比对反馈类型：</label>
									<div class="col-md-8">
										<select name="comparetype" class="form-control">
											<option value="">请选择</option>
											<option value="建档立卡">建档立卡</option>
											<option value="农村低保">农村低保</option>
											<option value="城市低保">城市低保</option>
											<option value="特困人员">特困人员</option>
											<option value="孤儿">孤儿</option>
											<option value="烈士子女">烈士子女</option>
											<option value="残疾学生">残疾学生</option>
										</select> 
									</div>
								</div>
								<div class="form-group">
									<label class="control-label col-md-3">证件号码 ：</label>
									<div class="col-md-8">
										<input type="text" name="cardtype" placeholder="请输入证件号码" class="form-control"  />
									</div>
								<!-- </div>
									<div class="form-group">
									<label class="control-label col-md-3">所属学校id：</label>
									<div class="col-md-8">
										<input type="text" name="schid" placeholder="请输入所属学校id" class="form-control"  />
									</div>
								</div> -->
									
								<!-- <div class="form-group">
									<label class="control-label col-md-3">所属学校：</label>
									<div class="col-md-8">
									 <select name="schid" class="form-control">
											<option value="">请选择</option>
										 
										</select> 
									</div>
								</div> -->
							 
							</div>
						</div>
						<div class="modal-footer">
							<button class="btn btn-danger" type="button">关闭</button>
							<button class="btn btn-primary" type="submit">修改</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	 
	 
	 <div class="modal fade" id="mymodalimport">
			<div class="modal-dialog">
				<div class="modal-content">
					<form action="${pageContext.request.contextPath}/departlist/importBetch"
					method="post" enctype="multipart/form-data"  class="form-horizontal">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
							<h4 class="modal-title" id="mylabel">导入部门比对学生</h4>
 						</div>
						<div class="modal-body">
							   
							  <!-- 学校-->
								<div class="form-group">
									<label class="control-label col-md-3">选择导入的文件（excel格式）：</label>
									<div class="col-md-8">
									    <input type="file"  name="file" class="form-control"  />
									</div>
								</div>
								  <!-- 学校-->
							 
						</div>
						<div class="modal-footer">
							<button class="btn btn-danger" data-dismiss="modal" type="button">关闭</button>
							<button class="btn btn-primary" type="submit" >导入</button>
						</div>
					</form>
				</div>
			</div>
		</div><!-- 弹层组件 添加标签 end -->
	</body>
	<!-- 弹层组件 添加标签 end -->
	<!-- <script type="text/javascript">
		$(function() {
			//alert("进来了");
			// 页面加载时  查询 分类 并放入 div中 
			$.ajax({
				type : "post",
				url : "departlist/listJson",
				dataType : "JSON",
				success : function(result) {
					//alert("进来了");
					var table = $("#listtable");
					for (var i = 0; i < result.list.length; i++) {
						table.append("<tr><td><input type='checkbox' name='' class='eid' id='' /></td><td>"
								+ result.list[i].id
								+ "</td><td>"
								+ result.list[i].name
								+"</td><td>"
								+ result.list[i].idcard
								+"</td><td>"
								+ result.list[i].schid
								+"</td><td>"
								+ result.list[i].level
								+"</td><td>"
								+ result.list[i].comparetype
								+"</td><td>"
								+ result.list[i].cardtype
								+"</td><td><button type='button' class='btn btn-primary' data-toggle='modal' data-target='#mymodal' ><span class='glyphicon glyphicon-edit'></span> 修改</button><button type='button' class='btn btn-danger'><span class='glyphicon glyphicon-remove'></span> 删除</button></td></tr>");
					}/* onClick=\"fhbut('"	+ "'),syalert.syopen('alert1')\" */
				}
			});
		})
	</script> -->
	<script type="text/javascript">
       function del(id){
    	  var flag =  confirm("确认是否删除？");
    	   if(flag){
    		   var path  ='${pageContext.request.contextPath}';
    		  // alert(id);
    		   location.href= path+"/departlist/delete?id="+id;
    	   }
       }
       function update(obj){/*点击修改按钮，给模态框加载信息并且弹出模态框*/
           var tds= $(obj).parent().parent().find('td');
          	$("input[name='id']").val(tds.eq(2).text());
    		$("input[name='name']").val(tds.eq(3).text());
    		$("input[name='idcard']").val(tds.eq(4).text());
    	//	$("select[name='schid']").val(tds.eq(4).text());
    		$("input[name='level']").val(tds.eq(6).text());
    		$("select[name='comparetype']").val(tds.eq(7).text());
    		$("input[name='cardtype']").val(tds.eq(8).text());
    	   }
	</script>
	<script type="text/javascript">
	function changeZhen(obj){
		 //ajax   根据镇id 查询 它学校表中的 数据 
		 
		if(obj.value!=''){
			  $.ajax({
					url : '../school/getSchoolByZid?zid='+obj.value,
					type : "get",
					dataType : "json",
					success : function(data) {
						 
						if(data!=null){
							$("#schid option:gt(0)").remove();
							for(var i=0;i<data.length;i++){
								var opt = "<option value='"+data[i].schid+"'>"+data[i].name+"("+data[i].level+")</optoin>";
								$("#schid").append(opt);
							}
						} 
					},
					error : function(xhr) {
						 
					}
				});
		}else{
			$("#schid option:gt(0)").remove();
		}
	}

	$(function () {
		 var flag  ='${successFlag}';
		 if(flag=='true'){
			 alert('操作成功！ ');
		 }
		 
        $('form:gt(0)').bootstrapValidator({
　 　　　　　　message: 'This value is not valid',
        feedbackIcons:{
			valid:'glyphicon glyphicon-ok',
			invalid:'glyphicon glyphicon-remove',
			validating:'glyphicon glyphicon-refresh'
　　　　　　　　},
            fields: {
                name: {
                    message: '用户名验证失败',
                    validators: {
                        notEmpty: {
                            message: '姓名不能为空'
                        }
                    }
                },
                idcard: {
                    validators: {
                        notEmpty: {
                            message: '身份证号不能为空'
                        },
                        stringLength: {
                            min: 18,
                            max: 18,
                            message: '身份证号长度必须是18位'
                        }
                    }
                },
                schid: {
                    validators: {
                        notEmpty: {
                            message: '学校不能为空'
                        }
                    }
                },
                comparetype: {
                    validators: {
                        notEmpty: {
                            message: '比对反馈类型不能为空'
                        }
                    }
                } ,
                cardtype: {
                    validators: {
                        notEmpty: {
                            message: '证件号码'
                        }
                    }
                }
            } ,
            submitHandler: function (validator, form, submitButton) {
              // alert("submit");
            }
        });
    });
	
	   function downTemplate(){
	  	   location.href="downTemplate";
	     }
	   
	   //批量删除 
		  function removeAll(){
			 var ids="";
				var checkId= document.getElementsByName("checkId");
				 for(var i=0;i<checkId.length;i++){
					 if(checkId[i].checked==true){
						 ids+=checkId[i].value+",";
					 }
				 }
				 
			    ids=ids.substring(0,ids.length-1);
			    var flag =  confirm("确认是否批量删除，请再次核实数据？");
			  	   if(flag){
			  		   var path  ='${pageContext.request.contextPath}';
			  		   //alert(id);
			  		    location.href= path+"/departlist/deleteBatch?ids="+ids;
			  	   }
		  }
		 
		 function checkAlls(obj){
			 var c = obj.checked;
			var checkId= document.getElementsByName("checkId");
			 for(var i=0;i<checkId.length;i++){
				 
				 checkId[i].checked=c;
			 }
			 
		 }
		 
		 
	</script>
</html>
